<template>
  <el-dialog title="批量退回"
             :close-on-click-modal="false"
             :visible.sync="dialogVisible"
             width="660px">
    <el-form ref="backForm"
             :model="backForm"
             label-width="auto">
      <el-row :gutter="20">
        <el-col :span="12">
          <el-form-item prop="examinePeople"
                        label="退回人员"
                        :rules="[required]">
            <el-input v-model.trim="backForm.examinePeople"
                      :maxlength="20"></el-input>
          </el-form-item>
        </el-col>
        <el-col :span="12">
          <el-form-item prop="backTime"
                        label="退回时间">
            <el-date-picker v-model="backForm.backTime"
                            :clearable="false"
                            :editable="false"
                            type="datetime"
                            placeholder="选择日期时间"
                            value-format="yyyy-MM-dd HH:mm:ss"
                            style="width:100%">
            </el-date-picker>
          </el-form-item>
        </el-col>
        <el-col :span="24">
          <el-form-item prop="examineDes"
                        label="退回说明">
            <el-input placeholder=""
                      type="textarea"
                      :rows="3"
                      resize="none"
                      :maxlength="500"
                      v-model.trim="backForm.examineDes"></el-input>
          </el-form-item>
        </el-col>
      </el-row>
    </el-form>
    <div slot="footer"
         class="dialog-footer">
      <el-button @click="dialogVisible = false">关 闭</el-button>
      <el-button type="primary"
                 @click="submit">确 定</el-button>
    </div>
  </el-dialog>

</template>

<script>
import { mapGetters } from 'vuex';
import dayjs from "dayjs";
export default {
  name: 'WaterSaveBatchBack',
  data() {
    return {
      dialogVisible: false,
      backForm: {
        examinePeople: '',
        status: '4',
        examineDes: '',
        backTime: ''
      },
      required: {
        required: true,
        message: '必填，不能为空',
        trigger: ['blur', 'change']
      },
    }
  },
  computed: {
    ...mapGetters(['name'])
  },
  methods: {
    open() {
      this.dialogVisible = true;
      let name = this.name;
      this.$nextTick(() => {
        this.$refs.backForm.resetFields();
        this.backForm.examinePeople = name;
        this.backForm.backTime = dayjs().format('YYYY-MM-DD HH:mm:ss');
      })
    },
    // 提交
    submit() {
      this.$emit('backSubmit', this.backForm)
      this.dialogVisible = false;
    }
  },
}
</script>

<style lang="scss" scoped>
/deep/.el-dialog__body {
  padding: 10px 20px 0 20px;
}
</style>